

import React, { Component } from 'react';
import Button from 'react-native-button';


const ACTIVE_OPACITY = 0.5;

/**
 * param style
 * param textStyle
 * param buttonTheme
 */
export default class CommonTouchable extends Component {
  constructor(props) {
    super(props);
    this.state = {};
  }

  render() {
    let { style, textStyle, buttonTheme, ...other } = this.props;  // eslint-disable-line
    if (buttonTheme && Styles[buttonTheme]) {
      style = [style, Styles[buttonTheme].btn];
      textStyle = [textStyle, Styles[buttonTheme].text];
    }
    return (
      <Button
        activeOpacity={ACTIVE_OPACITY}
        {...other}
        containerStyle={style}
        style={textStyle}
      >
        {
          this.props.children
        }
      </Button>
    );
  }
}

const Styles = {
  default: {
    btn: {
      backgroundColor: '#fff',
      borderColor: '#fff',
    },
    text: {
      color: '#fbb307',
      fontWeight: 'bold',
    }
  },
  orange: {
    btn: {
      backgroundColor: '#FED80E',
      borderColor: '#FED80E',
    },
    text: {
      color: '#393939',
      fontWeight: 'bold',
    }
  },
  gray: {
    btn: {
      backgroundColor: '#f3f3f3',
      borderColor: '#f3f3f3',
    },
    text: {
      color: '#fbb307',
      fontWeight: 'bold',
    }
  },


};
